<template>
  <div id="view-home">
    <Aside :menuItems="asideAttrs.menuItems" :title="asideAttrs.title">
      <router-view></router-view>
    </Aside>
  </div>
</template>
<script>
import Aside from "../../components/aside/aside";

export default {
  name: "Home",
  components: {
    Aside,
  },
  data() {
    return {
      asideAttrs: {
        title: "WeParty",
        menuItems: [
          {
            iconType: "fire",
            iconTheme: "filled",
            name: "Popular",
            link: "/popular",
          },
          {
            iconType: "thunderbolt",
            iconTheme: "filled",
            name: "Latest",
            link: "/latest",
          },
          {
            iconType: "star",
            iconTheme: "filled",
            name: "Liked",
            link: "/liked",
          },
          {
            iconType: "flag",
            iconTheme: "filled",
            name: "Publish Activity",
            link: sessionStorage.getItem("id") ? "/publish" : "/login",
          },
        ],
      },
    };
  },
};
</script>

<style lang="less" scope>
#view-home {
  height: 100%;
  width: 100%;
}
</style>